<template>
    <van-nav-bar :class="computedClass" :title="props.title" :left-text="props.leftText" :right-text="props.rightText"
        :left-arrow="props.leftIcon" @click-left="onClickLeft" @click-right="onClickRight" :border="false" />
</template>

<script setup>
import { computed } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import uiUtil from "../util/UiUtil";
const router = useRouter();
const route = useRoute();
//props方式 接受父组件传进来的
const props = defineProps({
    type: {
        type: String,
        default: '白'
    },
    leftIcon: Boolean,
    leftText: String,
    title: String,
    rightText: String,
    onLeft: Function,
    onRight: Function,
});
function onClickLeft() {
    try {
        if (props.onLeft) {
            props.onLeft()
        } else {
      if (route.path != uiUtil.routerPath.main) {
        router.back();
      } else {
        // 如果是主页，直接退出
      }
        }
    } catch (e) {
        console.log("onClickLeft", e)
        router.back()
    }
}
function onClickRight() {
    try {
        if (props.onRight) {
            props.onRight()
        }
    } catch (e) {
        console.log("onClickRight", props)
    }
}
const computedClass = computed(() => {
    return {
        'vant_header1': props.type == '白',
        'vant_header2': props.type == '黑'
    };
});

</script>

<style scoped lang="less"></style>